﻿ html,
 body {
     height: 100%;
     color: #283655;
     font-family: 'OpenSans', sans-serif;
     font-size: 14px;
 }

 @font-face {
     font-family: 'OpenSans';
     font-style: normal;
     font-weight: 300;
     src: url("../fonts/OpenSans-Regular.ttf");
 }

 @font-face {
     font-family: 'OpenSans';
     font-style: bold;
     font-weight: 700;
     src: url("../fonts/OpenSans-Bold.ttf");
 }

 h1,
 h2,
 h3,
 h4 {
     color: #283655;
     padding-top: 20px;
     padding-bottom: 20px;
     font-weight: bold;
 }

 h5,
 h6 {
     font-weight: bold;
 }

 a {
     color: white;
 }

 a:hover {
     color: #fafafad1;
 }

 .logo {
     width: 200px;
     margin: 3px 2px;
 }

 .navbar-light {
     width: 100%;
     z-index: 9;
     background-color: #f6f6f6;
 }

 .nav-item .enow {
     height: 50px !important;
     margin-top: 24px !important;
     line-height: 32px !important;
 }

 .nav-link {
     font-weight: bold;
     color: black !important;
     margin: 0px 30px;
     border-bottom: 2px solid rgba(255, 255, 255, .0);
 }

 .container.navbar-light {
     background-color: transparent !important;
 }

 /*.nav-link.dropdown-toggle::after {
 display: none;
 }*/

 /* .nav-active {
 border-bottom: 2px solid #16AEE1;
 color: #16AEE1 !important;
 }*/


 /****** JiSlider css ******/


 #JiSlider {
     width: 100%;
     height: 100%;
     position: relative;
 }

 .jislider ul {
     height: 100%;
     margin: 0;
     padding: 0;
     position: relative;
     list-style-type: none;
 }

 .jislider ul li {
     position: relative;
     height: 100%;
     /* float: left;*/
     overflow: hidden;
 }

 .jislider__img {
     position: absolute;
     top: 0;
     left: 0;
     background-size: cover;
     background-position: center;
     width: 100%;
     height: 100%;
     z-index: -1;
 }

 .jislider__left-arrow {
     position: absolute;
     left: 30px;
     top: 0;
     bottom: 0;
     margin: auto;
     width: 30px;
     height: 60px;
     cursor: pointer;
 }

 .jislider__left-arrow__top {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 2px;
     height: 30px;
     background-color: inherit;
     -webkit-transform: rotate(30deg) translateX(10px) translateY(-3px);
     -ms-transform: rotate(30deg) translateX(10px) translateY(-3px);
     transform: rotate(30deg) translateX(10px) translateY(-3px);
 }

 .jislider__left-arrow__bottom {
     content: '';
     position: absolute;
     bottom: 0;
     left: 0;
     width: 2px;
     height: 30px;
     background-color: inherit;
     -webkit-transform: rotate(-30deg) translateX(10px) translateY(3px);
     -ms-transform: rotate(-30deg) translateX(10px) translateY(3px);
     transform: rotate(-30deg) translateX(10px) translateY(3px);
 }


 .jislider__right-arrow {
     position: absolute;
     right: 30px;
     top: 0;
     bottom: 0;
     margin: auto;
     width: 30px;
     height: 60px;
     cursor: pointer;
 }

 .jislider__right-arrow__top {
     content: '';
     position: absolute;
     top: 0;
     right: 0;
     width: 2px;
     height: 30px;
     background-color: inherit;
     -webkit-transform: rotate(-30deg) translateX(-10px) translateY(-3px);
     -ms-transform: rotate(-30deg) translateX(-10px) translateY(-3px);
     transform: rotate(-30deg) translateX(-10px) translateY(-3px);
 }

 .jislider__right-arrow__bottom {
     content: '';
     position: absolute;
     bottom: 0;
     right: 0;
     width: 2px;
     height: 30px;
     background-color: inherit;
     -webkit-transform: rotate(30deg) translateX(-10px) translateY(3px);
     -ms-transform: rotate(30deg) translateX(-10px) translateY(3px);
     transform: rotate(30deg) translateX(-10px) translateY(3px);
 }

 .jislider__controller {
     position: absolute;
     max-width: 80%;
     left: 0;
     right: 0;
     bottom: 100px;
     margin: auto;
     text-align: center;
 }

 .jislider__button {
     display: inline-block;
     width: 10px;
     height: 10px;
     margin: 5px;
     box-sizing: border-box;
     border-radius: 50%;
     cursor: pointer;
 }

 .bg-cyan {
     background-color: #16AEE1;
 }

 .theme-clr {
     color: #16AEE1 !important;
 }

 .counter {
     text-align: center;
 }

 .employees,
 .customer,
 .design,
 .order {
     margin-top: 20px;
     margin-bottom: 20px;
 }

 .counter-count {
     font-size: 40px;
     position: relative;
     color: #ffffff;
     text-align: center;
     display: inline-block;
 }

 .counter-prop {
     font-size: 40px;
     position: relative;
     color: #ffffff;
     text-align: center;
     display: inline-block;
 }

 .counter-sup {
     font-size: 30px;
     position: relative;
     color: #ffffff;
     text-align: center;
     display: inline-block;
     vertical-align: top;
     margin-top: 20px;
 }

 .employee-p,
 .customer-p,
 .order-p,
 .design-p {
     font-size: 15px;
     color: #fff;
     font-weight: bold;
     width: 70%;
     margin: auto;
 }

 .counter p {
     margin-bottom: 0 !important;
 }

 .design {
     margin-bottom: 10px !important;
 }

 .bg-gray {
     background-color: #F1F0EF;
 }

 .white-box {
     padding: 20px 15px;
     border-radius: 10px;
     background-color: #fff;
     margin-bottom: 20px;
     transition-duration: 0.3s;
     transition-timing-function: ease-out;
 }

 .white-box-img img {
     border-radius: .50rem;
     margin-bottom: 20px;
     max-height: 180px;
 }

 .white-box p {
     font-size: 14px;
     font-weight: bold;
     color: black;
     /*min-height: 62px;*/
     display: -webkit-box;
     -webkit-line-clamp: 3;
     -webkit-box-orient: vertical;
     overflow: hidden;
     text-align: center;
 }

 .services-block {
     position: relative;
     margin-bottom: 25px;
 }

 .services-block .inner-box {
     position: relative;
     text-align: center;
     padding: 0px 25px;
     z-index: 9;
     transition: all 0.4s ease-in-out;
     padding: 15px;
     box-sizing: border-box;
     overflow: hidden;
 }

 .services-block .inner-box .icon img {
     height: 60px;
 }


 .services-block .inner-box:hover {
     /* -webkit-box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.15);
 -moz-box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.15);
 box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.15); */
     transform: translateY(-5px);
 }

 /*
 .inner-box::before,
 .inner-box::after {
 box-sizing: inherit;
 content: '';
 position: absolute;
 width: 100%;
 height: 100%;
 }


 .inner-box::before,
 .inner-box::after {
 top: 0;
 left: 0;
 height: 100%;
 width: 100%;
 -webkit-transform-origin: inner-box;
 transform-origin: inner-box;
 }

 .inner-box::before {
 border-top: 2px solid #16AEE1;
 border-bottom: 2px solid #16AEE1;
 -webkit-transform: scale3d(0, 1, 1);
 transform: scale3d(0, 1, 1);
 }

 .inner-box::after {
 border-left: 2px solid #16AEE1;
 border-right: 2px solid #16AEE1;
 -webkit-transform: scale3d(1, 0, 1);
 transform: scale3d(1, 0, 1);
 }

 .inner-box:hover::before,
 .inner-box:hover::after {
 -webkit-transform: scale3d(1, 1, 1);
 transform: scale3d(1, 1, 1);
 transition: -webkit-transform 0.9s;
 transition: transform 0.9s;
 transition: transform 0.9s, -webkit-transform 0.9s;
 }
 */


 .services-block .inner-box h3 {
     position: relative;
     font-size: 22px;
     font-weight: 700;
     height: 60px;
 }

 .services-block .inner-box .text {
     color: #283655;
     font-size: 14px;
 }

 a:hover {
     text-decoration: none !important;
 }

 .carousel-control-prev {
     left: -3% !important;
 }

 .carousel-control-next {
     right: -3% !important;
 }

 .carousel-control-prev-icon {
     background-image: url(../images/Arrow-left.svg);
 }

 .carousel-control-next-icon {
     background-image: url(../images/arrow-right.svg);
 }

 .carousel-control-next-icon,
 .carousel-control-prev-icon {
     width: 26px;
     height: 26px;
 }

 .carousel-indicators {
     bottom: -45px;
 }

 .carousel-indicators li {
     width: 10px;
     height: 10px;
     border-radius: 100%;
 }

 .carousel-indicators .active {
     background-color: #16AEE1;
 }

 .carousel-indicators li {
     background-color: #9F9F9F;
 }

 .border-bottom-green {
     border-bottom: 7px solid #938D34;
 }

 .border-bottom-red {
     border-bottom: 7px solid #AD2A24;
 }

 .border-bottom-pink {
     border-bottom: 7px solid #E6305D;
 }

 .min-h-320 {
     min-height: 320px;
 }

 .bg-lightblue {
     background-color: #283655;
 }

 .dashboard {
     background-color: #fff;
     border-radius: 10px;
     padding: 10px 30px;
     border-left: 10px solid #B9E4FA;
     color: #000;
     margin-bottom: 40px;
     margin-top: 10px;
     min-height: 130px;
     transition: all 0.4s ease-in-out;
 }

 .dashboard p {
     font-size: 14px;
     margin-bottom: 10px;
 }

 .dashboard p:nth-last-child(1) {
     color: #B7B7B7;
     text-align: right;
     font-size: 14px;
     margin-bottom: 0px;
     margin-top: 20px;
 }

 .dashboard:hover {
     box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.15);
     transform: translateY(-10px);
 }

 .btn-primary {
     background-color: #283655;
     border: #283655;
     padding: 7px 50px !important;
     border-radius: 3px;
     color: #fff !important;
 }

 .btn-white {
     background-color: #fff;
     border: #fff;
     padding: 2% 15%;
     border-radius: 10px;
 }

 .btn-white:hover {
     background-color: #ffffffc7;
     border: #ffffffc7;
 }

 .btn-primary:hover {
     background-color: #283655e0;
     border: #283655e0;
 }

 .form-control {
     border-radius: 3px;
     border: 1px solid #707070 !important;
 }

 .bg-footer {
     background-color: #363636;
     text-align: center;
 }

 .copyright {
     color: white;
     font-size: 12px !important;
 }

 .media-icon p,
 .media-icon i {
     display: inline-block;
 }

 .media-icon i {
     font-size: 25px;
     margin: 0px 10px;
     vertical-align: middle;
 }

 .banner-content {
     position: absolute;
     border-radius: 10px;
     background-color: rgba(0, 0, 0, 0.1);
     padding: 1% 5%;
     left: 10%;
     top: 0%;
     width: 80%;
     color: #fff;
     text-align: center;
     font-size: 12px;
     background-image: url(../images/duc-icon.png);
     background-repeat: no-repeat;
     background-position: center top;
 }


 .banner-content .btn {
     font-size: 12px;
 }

 #banner-content img {
     background-size: contain;
 }

 .animated {
     -webkit-animation-duration: 4s;
     animation-duration: 4s;
     -webkit-animation-fill-mode: both;
     animation-fill-mode: both;
 }

 @-webkit-keyframes fadeInLeft {
     0% {
         opacity: 0;
         -webkit-transform: translateX(-20px);
         transform: translateX(-20px);
     }

     100% {
         opacity: 1;
         -webkit-transform: translateX(0);
         transform: translateX(0);
     }
 }

 @keyframes fadeInLeft {
     0% {
         opacity: 0;
         -webkit-transform: translateX(-20px);
         -ms-transform: translateX(-20px);
         transform: translateX(-20px);
     }

     100% {
         opacity: 1;
         -webkit-transform: translateX(0);
         -ms-transform: translateX(0);
         transform: translateX(0);
     }
 }

 .fadeInLeft {
     -webkit-animation-name: fadeInLeft;
     animation-name: fadeInLeft;
 }

 .dropdown:hover > .dropdown-menu {
     display: block;
 }

 .nav-link:hover {
     /*
 border-bottom: 2px solid #16AEE1;
 color: #16AEE1 !important;
 box-sizing: border-box
 */
 }

 .dropdown-submenu:hover .dropdown-menu {
     display: block;
     left: 100% !important;
 }

 .banner-section {
     position: relative;
     font-size: 12px;
     width: 100%;
 }

 .banner-section img {
     height: auto;
     width: 100%;
 }

 .img-content {
     position: absolute;
     color: white;
     bottom: 0%;
     width: 100%;
     text-align: center;
 }

 .img-content h4 {
     font-size: 25px;
 }

 .img-content p {
     font-size: 16px;
 }

 .img-content-center {
     position: absolute;
     color: white;
     top: 50%;
     width: 100%;
     text-align: center;
 }

 .img-content-bottom {
     position: absolute;
     color: white;
     bottom: 0;
     width: 100%;
     text-align: right;
     /* margin-right: 20px; */
 }

 .white-box ul li {
     font-size: 20px;
     margin-bottom: 22px;
     margin-left: 15px;
 }

 .white-box ul li:before {
     content: "\f054";
     font-family: FontAwesome;
     margin-right: 10px;
     font-size: 12px;
     margin-left: -1.4em;
     width: 1.3em;
 }

 .white-box:hover {
     transform: translateY(8px);
 }

 .white-box.min-h-320:hover {
     transform: translateY(0px);
 }

 #mainimage {
     margin-bottom: 1rem;
 }



 .navbar-light {
     /* background-color: #ffffffe8; */
 }

 .navbar-expand-lg .navbar-nav .dropdown-menu {
     margin: 0px;
 }


 .animated {
     -webkit-animation-duration: 1s;
     animation-duration: 1s;
     -webkit-animation-fill-mode: both;
     animation-fill-mode: both;
 }

 @-webkit-keyframes fadeInUp {
     0% {
         opacity: 0;
         -webkit-transform: translateY(20px);
         transform: translateY(20px);
     }

     100% {
         opacity: 1;
         -webkit-transform: translateY(0);
         transform: translateY(0);
     }
 }

 @keyframes fadeInUp {
     0% {
         opacity: 0;
         -webkit-transform: translateY(20px);
         -ms-transform: translateY(20px);
         transform: translateY(20px);
     }

     100% {
         opacity: 1;
         -webkit-transform: translateY(0);
         -ms-transform: translateY(0);
         transform: translateY(0);
     }
 }

 .fadeInUp {
     -webkit-animation-name: fadeInUp;
     animation-name: fadeInUp;
 }

 .navbar-toggler:focus,
 .navbar-toggler:active {
     outline: 0;
 }

 .navbar-toggler span {
     display: block;
     background-color: #000;
     height: 3px;
     width: 25px;
     margin-top: 4px;
     margin-bottom: 4px;
     -webkit-transform: rotate(0deg);
     -moz-transform: rotate(0deg);
     -o-transform: rotate(0deg);
     transform: rotate(0deg);
     position: relative;
     left: 0;
     opacity: 1;
 }

 .navbar-toggler span:nth-child(1),
 .navbar-toggler span:nth-child(3) {
     -webkit-transition: transform .35s ease-in-out;
     -moz-transition: transform .35s ease-in-out;
     -o-transition: transform .35s ease-in-out;
     transition: transform .35s ease-in-out;
 }

 .navbar-toggler:not(.collapsed) span:nth-child(1) {
     left: 0px;
     top: 10px;
     -webkit-transform: rotate(135deg);
     -moz-transform: rotate(135deg);
     -o-transform: rotate(135deg);
     transform: rotate(135deg);
     opacity: 0.9;
 }

 .navbar-toggler:not(.collapsed) span:nth-child(2) {
     height: 12px;
     visibility: hidden;
     background-color: transparent;
 }

 .navbar-toggler:not(.collapsed) span:nth-child(3) {
     left: 0px;
     top: -12px;
     -webkit-transform: rotate(-135deg);
     -moz-transform: rotate(-135deg);
     -o-transform: rotate(-135deg);
     transform: rotate(-135deg);
     opacity: 0.9;
 }

 video {
     object-fit: cover;
     height: 100%;
 }

 .counter img {
     height: 45px;
     margin-bottom: 0px !important;
 }

 .w-45 {
     width: 45px !important;
 }

 .animate {
     opacity: 0;
     -webkit-animation-duration: 1s;
     -moz-animation-duration: 1s;
     -ms-animation-duration: 1s;
     -o-animation-duration: 1s;
     animation-duration: 1s;
     -webkit-animation-fill-mode: both;
     -moz-animation-fill-mode: both;
     -ms-animation-fill-mode: both;
     -o-animation-fill-mode: both;
     animation-fill-mode: both;
 }

 .animate.zoomInLeftLarge {
     -webkit-animation-name: zoomInLeftLarge;
     -moz-animation-name: zoomInLeftLarge;
     -ms-animation-name: zoomInLeftLarge;
     -o-animation-name: zoomInLeftLarge;
     animation-name: zoomInLeftLarge;
 }

 @-webkit-keyframes zoomInLeftLarge {
     0% {
         opacity: 0;
         -webkit-transform: scale(0) translateX(-1000px);
     }

     100% {
         opacity: 1;
         -webkit-transform: scale(1) translateX(0);
     }
 }

 @-moz-keyframes zoomInLeftLarge {
     0% {
         opacity: 0;
         -moz-transform: scale(0) translateX(-1000px);
     }

     100% {
         opacity: 1;
         -moz-transform: scale(1) translateX(0);
     }
 }

 @-ms-keyframes zoomInLeftLarge {
     0% {
         opacity: 0;
         -ms-transform: scale(0) translateX(-1000px);
     }

     100% {
         opacity: 1;
         -ms-transform: scale(1) translateX(0);
     }
 }

 @-o-keyframes zoomInLeftLarge {
     0% {
         opacity: 0;
         -o-transform: scale(0) translateX(-1000px);
     }

     100% {
         opacity: 1;
         -o-transform: scale(1) translateX(0);
     }
 }

 @keyframes zoomInLeftLarge {
     0% {
         opacity: 0;
         transform: scale(0) translateX(-1000px);
     }

     100% {
         opacity: 1;
         transform: scale(1) translateX(0);
     }
 }

 /* ----- Slider Styles----- */

 #homepage_slider video {
     min-height: 100% !important;
     min-width: 100% !important;
     height: 835px !important;
     width: auto !important;
     overflow: hidden;
 }

 #homepage_slider img {
     width: 100%;
     max-width: 100%;
     /* height: 835px; */
     vertical-align: middle;
     border: 0;
 }

 .carousel-inner > .item > img {
     display: block;
     line-height: 1;
 }

 /* button to display if user choses to not autoplay the video: */
 #slider-play-button button {
     display: inline-block;
     border: 0.06666em solid #fff;
     font-size: 2rem;
     background: rgba(255, 255, 255, 0.23);
     color: #fff;
     cursor: pointer;
     transition: .3s background;
     line-height: 1.3em;
     height: 1.5em;
     width: 2.5em;
     border-radius: 0.3em;
     position: absolute;
     opacity: .7;
     right: 1em;
     top: 20%;
 }

 .play-video-button:before {
     font-family: FontAwesome;
     content: "\f04b";
 }

 .pause-video-button:before {
     font-family: FontAwesome;
     content: "\f04c";
 }


 .carousel-control {
     position: absolute;
     top: 50%;
     left: 15px;
     width: 40px;
     height: 40px;
     margin-top: -20px;
     font-size: 35px;
     font-weight: 100;
     line-height: 30px;
     color: #fff;
     text-align: center;
     background: #222;
     border: 3px solid #fff;
     -webkit-border-radius: 23px;
     -moz-border-radius: 23px;
     border-radius: 23px;
     opacity: .5;
     filter: alpha(opacity=50)
 }

 .carousel-control.right {
     right: 15px;
     left: auto
 }

 .carousel-control:hover,
 .carousel-control:focus {
     color: #fff;
     text-decoration: none;
     opacity: .9;
     filter: alpha(opacity=90)
 }

 .carousel-indicators.banner {
     position: absolute;
     bottom: 20%;
     right: 15px;
     z-index: 5;
     margin: 0;
     list-style: none
 }

 .carousel-indicators.banner li {
     display: block;
     float: left;
     width: 10px;
     height: 10px;
     margin-left: 5px;
     text-indent: -999px;
     background-color: #ccc;
     background-color: rgba(255, 255, 255, 0.25);
     border-radius: 5px
 }

 .carousel-indicators.banner .active {
     background-color: #fff
 }



 /* ----- Slider Styles----- */


 .scroll-to-top {
     position: fixed;
     bottom: 80px;
     right: 15px;
     width: 40px;
     height: 40px;
     color: #fff;
     font-size: 22px;
     text-transform: uppercase;
     line-height: 38px;
     text-align: center;
     z-index: 100;
     cursor: pointer;
     border-radius: 50%;
     background: #16AEE1;
     display: none;
     -webkit-transition: all 300ms ease;
     -ms-transition: all 300ms ease;
     -moz-transition: all 300ms ease;
     transition: all 300ms ease;
 }


 .scroll-to-top:hover {
     box-shadow: 0px 0px 10px #666262;
     color: #16AEE1;
     background: #fff;
 }

 ul.breadcrumb {
     padding: 10px 16px;
     list-style: none;
     background-color: transparent;
     margin-bottom: 0px;
     display: block;
 }

 ul.breadcrumb li {
     display: inline;
     font-size: 13px;
 }

 /* ul.breadcrumb li:last-child {
 color: #16AEE1;
 } */


 ul.breadcrumb li + li:before {
     padding: 8px;
     color: #fff;
     content: "\003e";
     font-family: monospace;
 }

 ul.breadcrumb li a {
     text-decoration: none;
 }

 ul.breadcrumb li a:hover {
     color: #16AEE1;
     text-decoration: underline;
 }

 .nav-item.border {
     border: 1px solid #acacac !important;
 }

 .nav-link.brdr-left {
     border-left: 5px solid #16AEE1;
     margin-left: 0px !important;
     margin-right: 0px !important;
     border-bottom: none;
     background: linear-gradient(to left, #fff 50%, #16AEE1 50%);
     background-size: 200% 100%;
     background-position: right bottom;
     margin-left: 10px;
     transition: all 1s ease;
 }

 .nav-link.bg-gray,
 .nav-link.bg-gray:hover {
     background-color: #CACACA;
     border: 1px solid #CACACA;
     margin: 0px;
     font-size: 16px;
     margin-top: 12px;
     color: #000 !important;
 }

 .nav-link.bg-gray i {
     font-size: 24px;
 }

 .nav-link.brdr-left.active {
     color: white !important;
     background-color: #16AEE1 !important;
     background: none;
 }

 .nav-link.brdr-left:hover {
     color: white !important;
     background-position: left bottom;
 }

 .connect-us {
     background-color: #f8f8f8;
 }

 .form-control.cs {
     border-radius: 0px;
     border: 1px solid #ACACAC;
 }

 .mh-45 {
     min-height: 45px;
 }

 .mh-55 {
     min-height: 55px;
 }

 .btn-info {
     border: 1.2px solid #16AEE1 !important;
     color: #16AEE1 !important;
     background-color: transparent !important;
     font-weight: bold !important;
 }

 .btn-info:hover {
     color: #fff !important;
     background-color: #16AEE1 !important;
     border-color: #16AEE1 !important;
 }


 .brdr-btm-theme {
     border-bottom: 2px solid #16AEE1;
 }

 .mls ul li {
     font-size: 20px;
     margin-left: 30px;
     margin-bottom: 22px;
 }

 .mls ul li:before {
     content: "\f111";
     font-family: FontAwesome;
     margin-right: 9px;
     font-size: 10px;
     margin-left: -1.9em;
     color: #16AEE1;
 }

 .acrd ul li {
     font-size: 13px;
     margin-left: 30px;
     margin-bottom: 10px;
 }

 .acrd ul li:before {
     content: "\f111";
     font-family: FontAwesome;
     margin-right: 14px;
     font-size: 8px;
     margin-left: -1.4em;
     color: #16AEE1;
     vertical-align: middle;
 }

 [data-toggle="collapse"] .fa:before {
     content: "\f175";
     position: absolute;
     right: 4%;
     top: 6%;
 }

 [data-toggle="collapse"].collapsed .fa:before {
     content: "\f178";
     position: absolute;
     right: 4%;
     top: 40%;
 }

 .btn-link {
     font-weight: bold;
     font-size: 16px;
     color: #000;
     white-space: normal;
 }

 .btn-link:hover,
 .btn-link:focus {
     color: #16AEE1;
     text-decoration: none;
     background-color: transparent;
     border-color: transparent;
 }

 .card-header {
     background-color: transparent !important;
 }

 .carousel .media {
     position: relative;
     padding: 20px 0;
     padding-left: 10px;
 }

 .carousel .media img {
     width: 75px;
     height: 75px;
     display: block;
     border-radius: 50%;
     margin: auto;
 }

 .carousel .testimonial-wrapper {
     padding: 0 10px;
     padding-bottom: 50px;
 }

 .carousel .testimonial {
     color: #fff;
     position: relative;
     padding: 20px;
     background: #394865;
     border: 1px solid #394865;
     border-radius: 3px;
     margin-bottom: 15px;
 }

 .carousel .testimonial::after {
     content: "";
     width: 15px;
     height: 15px;
     display: block;
     background: #394865;
     border: 1px solid #394865;
     border-width: 0 0 1px 1px;
     position: absolute;
     bottom: -8px;
     left: 45%;
     transform: rotateZ(-46deg);
 }

 .overview {
     color: #fff;
     margin-top: 15px;
 }

 .carousel .overview b {
     text-transform: uppercase;
     font-size: 14px;
 }

 .bg-testi {
     background-image: url(../images/Testmonials-Section.jpg);
 }

 .brdr-top-green {
     border-top: 5px solid #50c05f !important;
 }

 .brdr-top-babyblue {
     border-top: 5px solid #00bbd3 !important;
 }

 .brdr-top-red {
     border-top: 5px solid #fe4565 !important;
 }

 .cl {
     font-size: 18px;
     padding-top: 15px;
     padding-bottom: 15px;
     width: 100%;
     margin-right: 0px !important;
     cursor: pointer;
 }

 .cl.active {
     background-color: #202E55;
 }

 .map-content,
 .map-content-1,
 .map-content-2 {
     width: 100%;
     margin: 0px;
 }

 div[class*="map-content-"] {
     display: none;
 }

 div.active {
     display: block;
 }



 .megamenu {
     position: absolute;
     top: 35px;
     color: #000;
     z-index: 1000;
     margin: 0px;
     text-align: left;
     padding: 14px 5px;
     font-size: 15px;
     border: solid 1px #eeeeee;
     background-color: #fff;
     opacity: 0;
     visibility: hidden;
     -o-transform-origin: 0% 0%;
     -ms-transform-origin: 0% 0%;
     -moz-transform-origin: 0% 0%;
     -webkit-transform-origin: 0% 0%;
     -o-transition: -o-transform 0.3s, opacity 0.3s;
     -ms-transition: -ms-transform 0.3s, opacity 0.3s;
     -moz-transition: -moz-transform 0.3s, opacity 0.3s;
     -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
     transform-style: preserve-3d;
     -o-transform-style: preserve-3d;
     -moz-transform-style: preserve-3d;
     -webkit-transform-style: preserve-3d;
     transform: rotateX(-75deg);
     -o-transform: rotateX(-75deg);
     -moz-transform: rotateX(-75deg);
     -webkit-transform: rotateX(-75deg);
 }

 .link-list li {
     display: block;
     white-space: nowrap;
     text-align: left;
 }

 .megamenu .title {
     border-bottom: 1px solid #CCC;
     font-size: 14px;
     padding: 9px 5px 9px 0px;
     font-size: 17px;
     color: #424242;
     margin: 0px 0px 7px 0px;
     text-align: left;
     height: 39px;
     font-weight: bold;
 }

 .link-list li a {
     line-height: 18px;
     border-right: none;
     text-align: left;
     padding: 6px 0px;
     background: #fff;
     background-image: none;
     border-right: 0 none;
     display: block;
     background-color: #fff;
     color: #424242;
     font-size: 14px;
 }

 .megamenu li i {
     margin-left: -20px;
     text-align: center;
     width: 18px;
     font-size: 13px;
 }



 li.page-item {
     margin-left: 5px;
 }

 .nav-link.dropdown-toggle {
     border-bottom: 1px solid #d3d3d3;
 }

 .wibs-section {
     position: relative;
     height: 300px;
     width: 100%;
     background-color: #16AEE1;
     color: #fff;
 }

 .navbar-expand-lg .navbar-nav .nav-link.nav-active {
     padding-left: 15px;
 }

 .dropdown.show .halfmenu {
     position: static;
     top: 0px;
     transition: transform all 0.5s ease;
     opacity: 1;
     visibility: visible;
     transform: rotateX(0deg);
     -o-transform: rotateX(0deg);
     -moz-transform: rotateX(0deg);
     -webkit-transform: rotateX(0deg);


 }

 .banner-content h4 {
     margin-top: 5rem;
 }

 @media only screen and (min-width:0px) {
     .carousel-control-next.cn {
         right: 0px !important;
     }

     .carousel-control-prev.cp {
         left: 0px !important;
     }

     .slide-content {
         position: absolute;
         left: 10%;
         top: 0%;
         width: 80%;
         color: #fff;
         background-color: rgba(0, 0, 0, 0.2);
         padding: 15px;
         box-sizing: border-box;
         box-shadow: 0px 0px 4px 2px #ffffff61;

     }

     .slide-content .section-title {
         font-size: 12px;
         color: #fff;
         font-weight: normal;
         text-transform: uppercase;
     }

     .slide-content p {
         font-size: 13px;
     }

     .dpi {
         width: 100%;
         margin: auto;
         display: block;
     }

 }

 @media only screen and (min-width:768px) {

     /*
 .carousel-control-prev {
 left: -5% !important;
 }

 .carousel-control-next {
 right: -5% !important;
 }
 */
     .img-content {
         bottom: 5%
     }

     li.page-item {
         margin-left: 10px;
     }

     .img-content h4 {
         font-size: 40px;
         line-height: 52px;
     }

     .logo {
         width: 200px;
     }

     .banner-content {
         position: absolute;
         border-radius: 10px;
         background-color: rgba(0, 0, 0, 0.1);
         padding: 1% 5%;
         left: 10%;
         top: 30%;
         width: 80%;
         color: #fff;
         text-align: center;
         font-size: 12px;
         background-image: url(../images/duc-icon.png);
         background-repeat: no-repeat;
         background-position: center top;
     }

     .slide-content {
         position: absolute;
         left: 10%;
         top: 15%;
         width: 80%;
         color: #fff;

     }

     .slide-content .section-title {
         font-size: 14px;
         color: #fff;
         font-weight: normal;
         text-transform: uppercase;
     }

     .slide-content p {
         font-size: 30px;
     }

     .services-block {
         position: relative;
         margin-bottom: 60px;
     }

     .dpi {
         width: 70%;
         margin: auto;
         display: block;
     }


 }

 @media only screen and (min-width:992px) {

     .navbar-light {
         position: inherit;
     }

     /* .carousel-control-prev {
 left: -8% !important;
 } */

     /*.carousel-control-next {
 right: -8% !important;
 }*/

     .carousel-control-next.cn {
         right: 0px !important;
     }

     .carousel-control-prev.cp {
         left: 0px !important;
     }

     .halfmenu {
         width: 500px;
         right: auto;
         left: auto;
     }

     .nav-link.dropdown-toggle {
         border-bottom: 0px solid gray;
     }

     .megamenu.sol {
         /* left: -100px;*/
     }

     .slide-content {
         position: absolute;
         left: 10%;
         top: 15%;
         width: 70%;
         color: #fff;

     }

     .slide-content .section-title {
         font-size: 14px;
         color: #fff;
         font-weight: normal;
         text-transform: uppercase;
     }

     .slide-content p {
         font-size: 30px;
     }

     .halfmenu {
         visibility: hidden;
         opacity: 0;
         margin: 0;
         padding: 0;
         position: absolute;
         left: 0px;
         background: #fff;
         transition: all 0.4s ease-out;
         border-bottom: 3px solid #16AEE1;
         z-index: -1;
         perspective: 1000px;
         transform: rotateX(-90deg);
         transform-origin: top left;
     }

     .nav-item.dropdown:hover > halfmenu {
         visibility: visible;
         opacity: 1;
         transform: translate(0, 0);
         margin-top: 0px;
         box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.19);
         transform: rotateX(0deg);
     }

     .nav-item.dropdown:hover .megamenu {
         opacity: 1;
         visibility: visible;
         transform: rotateX(0deg);
         -o-transform: rotateX(0deg);
         -moz-transform: rotateX(0deg);
         -webkit-transform: rotateX(0deg);
     }

     .counter-count,
     .counter-prop {
         font-size: 60px;
     }

     .design {
         margin-bottom: 20px !important;
     }


 }

 @media only screen and (min-width:1024px) {

     .dropdown.show .megamenu {
         position: absolute;
         top: 85px;
     }
 }
 @media (min-width: 992px) {
    .cr-container {
        max-width: 80% !important;
    }
}

 @media only screen and (min-width:1025px) {
     .logo {
         width: 55%;
         margin: 10px 2px;
     }

     .carousel-control-next.cn {
         right: 0px !important;
     }

     .carousel-control-prev.cp {
         left: 0px !important;
     }

     .carousel-control-prev {
         left: -15% !important;
     }

     .carousel-control-next {
         right: -15% !important;
     }

     .employees,
     .customer,
     .design,
     .order {
         margin-top: 40px;
         margin-bottom: 40px;
     }

     #mainimage {
         margin-bottom: 0rem;
     }

     .img-content {
         position: absolute;
         color: white;
         bottom: 2%;
         width: 50%;
         left: 25%;
         text-align: center;
     }

     .media-icon {
         text-align: right;
     }

     .copywrite {
         text-align: left;
     }

     ul.breadcrumb {
         padding: 25px 16px;
     }

     ul.breadcrumb li {
         font-size: 16px;
     }

     .banner-content {
         position: absolute;
         border-radius: 10px;
         background-color: rgba(0, 0, 0, 0.1);
         padding: 1% 5%;
         left: 30%;
         top: 30%;
         width: 40%;
         color: #fff;
         text-align: center;
         font-size: 12px;
         background-image: url(../images/duc-icon.png);
         background-repeat: no-repeat;
         background-position: center top;
     }

     .slide-content {
         position: absolute;
         left: 10%;
         top: 15%;
         width: 40%;
         color: #fff;


     }

     .slide-content .section-title {
         font-size: 14px;
         color: #fff;
         font-weight: normal;
         text-transform: uppercase;
     }

     .slide-content p {
         font-size: 30px;
     }

     .white-box-img img {
         height: 180px;
     }

     .white-box p {
         height: 40px;
         margin-bottom: 0px !important;
     }
 }

 @media only screen and (min-width:1827px) {

     ul.breadcrumb {
         padding: 10px 16px;
     }
 }

 @media only screen and (min-width:2050px) {

     ul.breadcrumb {
         padding: 35px 16px;
     }
 }

 @media only screen and (min-width:2300px) {

     ul.breadcrumb {
         padding: 40px 16px;
     }
 }

 @media only screen and (min-width:2520px) {

     ul.breadcrumb {
         padding: 45px 16px;
     }
 }

 .bg-count {
     background-image: url(../images/Countdown-Section.png);
     background-size: cover;
 }

 .service-intro {
     position: relative;
     height: 230px;
     margin-bottom: 30px;
     display: table;
     text-align: center;
     transition: all .3s ease;
     cursor: pointer;
 }

 .service-intro {
     display: table-cell;
     vertical-align: bottom;
 }

 .service-intro .title {
     position: relative;
     margin-top: 0;
     transition: color .3s ease;
     background-color: rgba(40, 54, 85, 0.9);
     color: #fff;
     margin-bottom: 0px;
 }

 .service-intro img {
     position: absolute;
     top: 0;
     z-index: -1;
     height: 230px;
 }

 .service-intro .text {
     position: relative;
     width: 75%;
     color: #fff;
     margin-left: auto;
     margin-right: auto;
     height: 0;
     overflow: hidden;
     transition: height .3s ease;
     margin-bottom: 0px;
 }

 .service-intro .btn-text {
     position: relative;
     width: 75%;
     margin-left: auto;
     margin-right: auto;
     height: 0;
     overflow: hidden;
     transition: height .3s ease;
     margin-bottom: 0px;
 }

 .service-intro:hover {
     background-color: rgba(40, 54, 85, 0.9);
 }

 .service-intro:hover .title {
     color: #fff;
     background-color: transparent;
 }

 .service-intro:hover .text {
     height: 45px;
     margin-bottom: 20px;
 }

 .service-intro:hover .btn-text {
     height: 50px;
     margin-bottom: 20px;
 }

 .btn-cstm {
     background: #fff;
     color: #16AEE1;
 }

 .btn-cstm:hover {
     background: #16AEE1;
     color: #fff;
 }

 .bg-regi {
     background-image: url(../images/form-Section.png);
     background-size: cover;
     color: #fff;
 }

 .bg-trop {
     background-color: rgba(255, 255, 255, 0.3);
     border: 1px solid #fff;
 }

 .bg-trop::placeholder {
     color: #fff;
 }

 .brdr-box {
     border: 2px solid #BFBFBF;
     border-radius: 10px;
     padding: 20px;
     position: relative;
     height: 205px;
     overflow: hidden;
     cursor: pointer;
 }

 .brdr-box img {
     margin: auto;
     width: 80px;
     height: 85px;
     display: block;
 }

 .brdr-box p {
     font-weight: bold;
 }

 .brdr-box:hover {
     border: 2px solid #16AEE1;
 }

 .brdr-box-hover {
     padding: 20px;
     position: absolute;
     top: 0%;
     width: 100%;
     left: 0;
     background: #16AEE1;
     transition: top 1s;
     color: #fff;
     opacity: 0;
     transform: translate(0, 80px);
     transition: all 0.2s ease 0s;
     height: 205px;
     overflow: hidden;
 }

 .brdr-box-hover img {
     width: 60px;
     height: 65px;
 }

 .brdr-box:hover .brdr-box-hover {
     opacity: 1;
     transform: translate(0, 0);
     transition: all 0.4s ease 0s;
 }

 .carousel-indicators.cstm-indi {
     bottom: 10px;
 }

 .carousel-indicators.cstm-indi li {
     background-color: #fff;
 }

 .carousel-indicators.cstm-indi .active {
     background-color: #16AEE1;
 }

 #banner {
     /* height: 750px; */
     /* min-height: 100vh; */

 }

 #banner img {
     /* height: 750px; */
     /* min-height: 100vh; */
     width: 100%;
     /*height: 90vh;*/
     object-fit: cover;

 }

 .navbar-expand-lg .navbar-nav .nav-link {
     padding-right: 0;
     padding-left: 0;
     margin: 0px;
     margin-right: 40px;
 }

 .hr-b {
     border-top: 1.2px solid #707070;
 }

 .loc-info,
 .loc-info h4 {
     color: #707070;
 }

 .loc-info p {
     font-size: 12px;
 }

 .loc-info img {
     width: 25px;
     margin-left: 5px;
     margin-top: -3px;
 }

 .csr-img {
     width: 65%;
     margin-top: 25%;
     margin-left: auto;
     display: block;
 }

 .im-brdr {
     border: 1px solid #5B5B5B;
     border-radius: 5px;
     height: 200px;
     margin-bottom: 40px;
 }

 .im-brdr img {
     width: 80%;
     display: block;
     margin: auto;
     margin-top: 18%;
 }

 .brdr-round img {
     max-width: 100%;
     height: auto;
     vertical-align: middle;
 }

 .rounded-circle {
     border-radius: 50% !important;
 }

 .team.text-center h4 {
     padding-bottom: 0px;
     color: #16AEE1;
     font-size: 1.38rem;
 }

 .team p {
     font-size: 14.5px;
     font-weight: bold;
     margin-bottom: 0;
 }

 .team-sec img {
     height: 150px;
     width: auto;
 }

 .less-mar {
     background-color: #16AEE1;
     padding: 10px;
     width: 100%;
     text-align: left;
     color: #fff;
     font-size: 25px;
 }

 .img-box img {
     width: 100%;
     height: 100%;
 }

 .cont-center p {
     border: 1px solid #16AEE1;
     text-align: left;
     padding: 10px 10px 10px 10px;
     margin-top: -7px !important;
     Height: auto;
 }

 .cmn-prop p {
     line-height: 2;
 }

 .flip-card {
     background-color: transparent;
     height: 100px;
     perspective: 1000px;
     margin-bottom: 40px;
 }

 .flip-card-inner {
     position: relative;
     width: 100%;
     height: 100%;
     text-align: center;
     transition: transform 0.6s;
     transform-style: preserve-3d;
     box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
 }

 .flip-card:hover .flip-card-inner {
     transform: rotateY(180deg);
 }

 .flip-card-front,
 .flip-card-back {
     position: absolute;
     width: 100%;
     height: 100%;
     backface-visibility: hidden;
 }

 .flip-card-back {
     background-color: #16AEE1;
     color: white;
     transform: rotateY(180deg);
 }

 .flip-card-back p {
     margin-top: 20% !important;
 }

 .flip-card-front img {
     width: 80%;
     display: block;
     margin: auto;
     margin-top: 18%;
 }

 .pop-up-overlay {
     position: fixed;
     display: flex;
     justify-content: center;
     align-items: center;
     color: white;
     top: 0;
     bottom: 0;
     left: 0;
     right: 0;
     background: #f3f3f3;
     transition: opacity 500ms;
     visibility: hidden;
     color: visible;
     opacity: 1;
     z-index: 99;
 }

 .pop-up-overlay:target {
     visibility: visible;
     opacity: 0.95;
 }

 .pop-up {
     text-align: center;
 }

 .pop-up p {
     margin: 5% 10% 0 10%;
     color: black;
 }

 .pop-up a {
     position: absolute;
     color: #D60101 !important;
     text-decoration: none;
     font-size: 200%;
     top: 3.5%;
     right: 5%;
 }

 /* ContactUs styles */


 .contact-box-place-office {
     position: relative;
     text-align: left;
     background: rgba(255, 255, 255, .8);
     border: 1px solid #f5f5f5;
     border-radius: 5px;
     box-shadow: 0 20px 30px rgba(0, 0, 0, .05);
     padding: 25px;
     margin: 15px 0;
     z-index: 9999;
     -webkit-transition-duration: .4s;
     transition-duration: .4s;
 }

 .contact-box-place-office ul li i {
     color: #46bfe2;
     font-size: 14px;
     margin-right: 15px;
 }

 .contact-box-place-office ul {
     text-align: left;
     margin-top: 20px;
     padding: 0;
 }

 .contact-box-place-office ul li {
     color: #666;
     font-size: 14px;
     font-weight: 400;
     padding: 5px 0;
     list-style: none;
 }

 .contact-box-place-office h4 {
     color: #222;
     font-size: 22px;
     font-weight: 500;
     margin-top: 0px;
 }

 .contact-box-place-office h6 {
     color: #555;
     font-size: 14px;
     font-weight: 500;
     margin-top: 7px;
 }

 .contact-box-place-office img {
     width: 25px;
     margin-left: 5px;
     margin-top: 5px;
     float: right;
 }

 .navbar-light {
     padding-top: 0;
     padding-bottom: 0;
 }

 .nav-link {
     width: auto;
     text-align: left;
     margin-right: 0px !important;
 }

 .nav-link:hover {
     background-color: #fff;
     color: #16AEE1 !important;

 }

 .nav-link {
     font-weight: 600;
     text-decoration: none;
     padding: 10px 0px;
     margin-top: 20px !important;
     display: block;
     color: #222222;
     transition: all 0.4s ease-in-out 0s;
     font-size: 16px;
     /* height: 74px;
 line-height: 60px; */
 }

 .nav-item.dropdown {
     display: table-cell;
     position: relative;
     z-index: 100;
     font-size: 0.8em;
     text-align: center;
 }



 /*.nav-item.dropdown:hover,
 .nav-item.dropdown:hover .nav-link {
 background: #fff;
 }*/

 .fa-chevron-right:before {
     font-size: 9px;
 }

 .nav-link.dropdown-toggle {
     transition: all 0.2s ease-in-out 0s;
 }

 .megamenu {
     top: 85px;
 }

 .megamenu.sol {
     left: 0px;
 }

 .link-list li {
     display: block;
     white-space: normal;
     text-align: left;
     margin-left: 45px;
 }

 .megamenu .title {
     border-bottom: 0px solid #CCC;
     font-size: 14px;
     padding: 9px 5px 9px 0px;
     font-size: 15px;
     color: #5d5656;
     margin: 18px 0px 0px 18px;
     text-align: left;
     height: 39px;
     font-weight: bold;
     margin-top: 10px;
 }

 .link-list li a {
     line-height: 18px;
     border-right: none;
     text-align: left;
     padding: 6px 0px;
     background: #fff;
     background-image: none;
     border-right: 0 none;
     display: block;
     background-color: #fff;
     color: #16AEE1;
     font-size: 14px;
 }

 .link-list li a:hover {
     opacity: 0.6;
 }

 @media only screen and (min-width:992px) {
     .nav-link {
         width: 200px;
         text-align: center;
         margin-right: 0px !important;
         margin-top: 0px !important;
     }

     .halfmenu {
         width: 650px;
         right: auto;
         left: auto;
         box-shadow: 0 4px 8px rgba(0, 0, 0, 0.9);
     }

     .halfmenu.solTempClass {
         left: -100%;
     }

     .halfmenu.aboutTempClass {
         width: 200px;
     }

     .pdf-gen .nav-link {
         width: auto;
         text-align: left;
     }

     .nav-link {
         font-weight: 600;
         text-decoration: none;
         padding: 15px 0px 5px 0px;
         display: block;
         color: #222222;
         transition: all 0.4s ease-in-out 0s;
         font-size: 18px;
         height: 85px;
         line-height: 70px;
     }

     .flip-card {
         height: 200px;
     }

     .dropdown-toggle::after {
         display: none;
     }

     .nav-item.dropdown:hover,
     .nav-item.dropdown:hover .nav-link {
         background: #fff;
     }

     #homepage_slider img {
         margin-top: -75px;
     }

 }

 .cspr {
     position: absolute;
     color: #ffffff;
     right: 10px;
     top: 10px;
     z-index: 9;
     font-size: 30px;
     opacity: 0.975;
 }

 .team-sec {
     padding: 40px 30px;
     border: 1px solid #eee;
     border-bottom: 5px double #d5d1d1;
     background: #f8f8f8;
     margin: 5px;
 }

 .media-icon a:hover {
     color: #fafafad1 !important;
 }

 .ms-webpartzone-cell,
 .ms-rtestate-field p,
 p.ms-rteElement-P {
     margin: auto;
 }

 .ms-rtestate-field h1,
 h1.ms-rteElement-H1,
 .ms-rtestate-field h2,
 h2.ms-rteElement-H2,
 .ms-rtestate-field h4,
 h4.ms-rteElement-H4 {
     color: inherit;
 }

 a:link,
 a:visited,
 a:hover,
 a:active {
     color: inherit;
 }

 p {
     margin-bottom: 1rem !important;
 }


 .HomeSection h2.text-center {
     font-size: 2.6rem;
     padding: 40px 40px;

 }


 .HomeSection input.form-control {
     padding: 1.54rem 0.85rem;
     border-radius: 20px;
 }


 .HomeSection textarea.form-control {
     min-height: 100px;
     border-radius: 20px;
 }

 .HomeSection .btn-primary {
     background-color: #283655;
     border: #283655;
     padding: 15px 50px !important;
     border-radius: 3px;
     color: #fff !important;
     font-size: 18px;
 }

 /************************************Alok CSS***************************/

 .UpdateLoader {
     position: fixed;
     text-align: center;
     height: 100%;
     width: 100%;
     top: 0;
     right: 0;
     left: 0;
     z-index: 9999999;
     background-color: #000000;
     opacity: 0.7;
 }

 .UpdateLoaderImg {
     margin-top: 0;
     width: 280px;
     background-image: : url("/Style%20Library/ar-sa/MOCITheme/images/loader.gif");
     position: absolute;
     right: 40%;
     top: 35%;
 }

 @font-face {
     font-family: 'FontAwesome';
     src: url('../fonts/fontawesome-webfont.eot?v=4.7.0');
     src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
     font-weight: normal;
     font-style: normal;
 }

 .ms-signInLink {
     /* display: none !important; */
 }

 .ContactUsStyle {
     width: 100%;
     height: 455px;
 }

 .bxs-shadow {
     box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
     height: 207px;
 }

 .bxs-shadow img {
     margin-top: 20px;
 }

 .buttelIconArrow {
     width: 15px;
     height: 15px;
 }

 input[type=button],
 input[type=reset],
 input[type=submit],
 button {
     min-width: auto !important;
 }

 .inner-box.bxs-shadow:hover::before,
 .inner-box.bxs-shadow:hover::after {
     border: none;
 }

 .inner-box.bxs-shadow:hover {
     transform: translateY(-8px);
 }

 .mls ul {
     padding-left: 10px;
 }

 .viewMorecls {
     color: #3B2F2F !important;
     font-style: italic;
 }

 .banner-section:before {
     content: '';
     position: absolute;
     bottom: 0;
     left: 0;
     width: 100%;
     height: 50%;
     /* background-image: linear-gradient(0deg, rgba(1, 2, 3, .75), transparent 60%, transparent), linear-gradient(rgba(2, 37, 52, .5), transparent 0%, transparent);*/

 }



 /*[contentEditable=true]:not(:focus):before {content: attr(data-text)}*/

 div[contenteditable=true] {
     color: #808080;
     font-size: 14px;
 }

 .selectToggle {
     border: solid 1px #517B97 !important;
     outline: 0;
     background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #CAD9E3), to(#FFFFFF));
     background: -moz-linear-gradient(top, #FFFFFF, #CAD9E3 1px, #FFFFFF 25px);
     box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 8px;
     -moz-box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 8px;
     -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 8px;
 }

 .cmn-prop p {
     font-size: 20px;
     text-align: justify;
 }

 .wibs-section.bg-lightblue {
     position: relative;
     height: 200px;
     width: 100%;
     background-color: #283655;
     color: #fff;
 }

 .wibs-section.bg-lightblue .img-content {
     position: absolute;
     color: white;
     bottom: 2%;
     width: 50%;
     left: 12.5%;
     text-align: left;
 }

 li.title a,
 li.title a:hover {
     color: #5d5656 !important;
     opacity: 1 !important;
 }

 .wicon40 {
     height: :40px;
 }

 .ms-rteTable-default,
 .ms-rteTable-default > tbody > tr > td,
 .ms-rteTable-default > tbody > tr > th,
 td.ms-rteTable-default,
 th.ms-rteTable-default,
 .ms-rtetablecells {
     border: none;
 }


 < !--- Responsive Table CSS ---- > .js-responsive-table tr:nth-child(even) {
     background-color: #fcfcfc;
 }

 .js-responsive-table tr:nth-child(odd) {
     background-color: #f3f3f3;
 }

 .js-responsive-table {
     margin-bottom: 1em;
     color: #000;
     width: 100%;
 }

 .js-responsive-table th,
 .js-responsive-table td {
     border-top: none;
     border-left: none;
     font-weight: bold;
     font-size: 14px;
 }

 .js-responsive-table tr {
     border-top: 1px solid #dddddd;
     border-left: none;
     font-size: 14px;
 }

 .js-responsive-table th {
     background: #16AEE1;
     color: #fff;
 }

 .js-responsive-table th,
 .js-responsive-table tr:first-child td {
     font-weight: bold;
 }

 .js-responsive-table .icon-accordion {
     display: none;
 }

 .js-responsive-table td h3 {
     margin: 0;
     padding: 0 0 5px 0;
     display: none;
     font-weight: bold;
 }

 .js-responsive-table table tr:hover {
     background-color: rgba(22, 174, 225, 0.5);
 }

 @media (max-width: 680px) {

     .js-responsive-table table,
     .js-responsive-table tbody,
     .js-responsive-table table tr,
     .js-responsive-table table td,
     .js-responsive-table table th {
         display: block;
         width: 100%;
     }

     .js-responsive-table table tr {
         max-height: 43px;
         overflow: hidden;
         position: relative;
         cursor: pointer;
     }

     .js-responsive-table .icon-accordion {
         display: block;
         text-align: center;
         width: 16px;
         height: 16px;
         position: absolute;
         right: 15px;
         top: 4px;
         font-style: normal;
         font-size: 1.6em;
     }

     .js-responsive-table td h3 {
         display: block;
     }
 }


 .vert .carousel-item-next.carousel-item-left,
 .vert .carousel-item-prev.carousel-item-right {
     -webkit-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
 }

 .vert .carousel-item-next,
 .vert .active.carousel-item-right {
     -webkit-transform: translate3d(0, 100%, 0);
     transform: translate3d(0, 100% 0);
 }

 .vert .carousel-item-prev,
 .vert .active.carousel-item-left {
     -webkit-transform: translate3d(0, -100%, 0);
     transform: translate3d(0, -100%, 0);
 }

 /* Footable Table */

 .footable > tbody {
     border: 1px solid #dddddd;
     ;
 }

 .footable {
     border-collapse: separate;
     border-spacing: 0;
     width: 100%;
     /* border: 3px solid #0a538d; */
     font-family: 'Droid Arabic Kufi', tahoma, Arial;
     color: #444444;
     /* background: #FDFDFD; */
     -moz-border-radius: 0;
     -webkit-border-radius: 0;
     border-radius: 0;
     margin: 10px 0px;
     background-color: #F9F9F9;
     font-weight: bold;
 }

 .footable.breakpoint > tbody > tr.footable-row-detail {
     background: #eeeeee;
 }

 .footable.breakpoint > tbody > tr:hover:not(.footable-row-detail) {
     cursor: pointer;
 }

 .footable.breakpoint > tbody > tr > td.footable-row-detail-cell {
     background: #fff;
 }

 .footable > tbody img {
     vertical-align: middle;
 }

 .footable > tbody > tr:hover:not(.footable-row-detail) {
     background: rgba(22, 174, 225, 0.5);
     ;
 }

 .footable > tbody > tr:hover:not(.footable-row-detail) > td {
     color: #000000;
 }

 .footable > tbody > tr:last-child > td {
     border-bottom: none;
 }

 .footable > tbody > tr > td {
     border-top: 1px solid #dddddd;
     padding: 10px;
     font-size: 14px;
 }

 .footable > tbody > tr > td.footable-row-detail-cell,
 .footable > tbody > tr > td.footable-first-column {
     border-left: none;
 }

 .footable > thead > tr > th {
     border-bottom: 1px solid #dddddd;
     padding: 10px;
     color: #ffffff;
     font-size: 14px;
 }

 .footable > thead > tr > th a:link,
 .footable > thead > tr > th a:visited,
 .footable > thead > tr > th a:hover,
 .footable > thead > tr > th a:active,
 table.GreyGrid th a:link,
 table.GreyGrid th a:visited,
 table.GreyGrid th a:hover,
 table.GreyGrid th a:active {
     font-size: 14px;
     color: #ffffff;
     font-weight: bold;
     text-decoration: underline;
     font-family: 'Droid Arabic Kufi', tahoma, Arial;
 }

 .footable > thead > tr > th a:hover,
 table.GreyGrid th a:hover {
     text-decoration: underline;
     color: #eeeeee;
 }




 .footable > thead > tr > th,
 .footable > thead > tr > td {
     background-color: #16AEE0;
     color: #ffffff;
     border-top: none;
     border-left: none;
     font-weight: bold;
     font-size: 14px;
 }

 .ms-WPBody td {
     font-family: 'Droid Arabic Kufi', tahoma, Arial;
 }

 .footable > thead > tr > th.footable-first-column,
 .footable > thead > tr > td.footable-first-column {
     border-left: none;
 }

 .footable > tfoot > tr > th,
 .footable > tfoot > tr > td {
     /* background-color: #1d2f6d; */
     /* border: 1px solid #0b32a1; */
     color: #1d2f6d;
     border-top: none;
     border-left: none;
     padding: 5px;
 }

 .footable > tfoot .pagination {
     text-align: center;
 }

 .footable > tfoot .pagination ul {
     display: inline-block;
     -webkit-box-shadow: none;
     -moz-box-shadow: none;
     box-shadow: none;
     vertical-align: middle;
     margin: 0;
     padding: 0;
 }

 .footable > tfoot .pagination ul > li {
     display: inline;
 }

 .footable > tfoot .pagination ul > li > a,
 .footable > tfoot .pagination ul > li > span {
     float: left;
     border: 2px solid transparent;
     margin: 0 3px;
     color: #ffffff;
     background: transparent;
     padding: 1px 5px;
     text-decoration: none;
 }

 .footable > tfoot .pagination ul > li.disabled > a {
     color: #888;
 }

 .footable > tfoot .pagination ul > li.active > a {
     border-color: #ffffff;
 }

 .footable > tfoot .pagination ul > li:first-child > a,
 .footable > tfoot .pagination ul > li:last-child > a,
 .footable > tfoot .pagination ul > li:first-child > span,
 .footable > tfoot .pagination ul > li:last-child > span {
     -moz-border-radius: 0;
     -webkit-border-radius: 0;
     border-radius: 0;
 }

 .footable.metro-red {
     border-color: #fa3031;
 }

 .footable.metro-red > tfoot > tr > th,
 .footable.metro-red > thead > tr > th,
 .footable.metro-red > tfoot > tr > td,
 .footable.metro-red > thead > tr > td {
     background-color: #fa3031;
     border-color: #fa3031;
 }

 .footable.metro-purple {
     border-color: #932ab6;
 }

 .footable.metro-purple > tfoot > tr > th,
 .footable.metro-purple > thead > tr > th,
 .footable.metro-purple > tfoot > tr > td,
 .footable.metro-purple > thead > tr > td {
     background-color: #932ab6;
     border-color: #932ab6;
 }

 .footable.metro-green {
     border-color: #43c83c;
 }

 .footable.metro-green > tfoot > tr > th,
 .footable.metro-green > thead > tr > th,
 .footable.metro-green > tfoot > tr > td,
 .footable.metro-green > thead > tr > td {
     background-color: #43c83c;
     border-color: #43c83c;
 }

 .footable.metro-blue {
     border-color: #1171a3;
 }

 .footable.metro-blue > tfoot > tr > th,
 .footable.metro-blue > thead > tr > th,
 .footable.metro-blue > tfoot > tr > td,
 .footable.metro-blue > thead > tr > td {
     background-color: #1171a3;
     border-color: #1171a3;
 }

 .footable-odd {
     background-color: #f7f7f7;
 }

 .footable .pagingRow td {
     background: #fff;
     border-width: 0;
     border-radius: 0px;
 }

 .footable .pagingRow tr td span {
     text-align: center;
     background: #0080c3;
     border-width: 0;
     padding: 2px 10px 2px 10px;
     color: #ffffff;
 }

 .footable > tbody > tr > td {
     border-right: none;

 }

 .footable > tbody > tr {
     border-bottom: none !important;

 }

 .footable > tbody > tr > td {
     border-bottom: none !important;

 }

 .footable.breakpoint > tbody > tr.footable-detail-show > td {
     border-bottom: none;
 }

 .footable.breakpoint > tbody > tr.footable-detail-show > td > span.footable-toggle:before {
     content: "\e001";
 }

 .footable.breakpoint > tbody > tr:hover:not(.footable-row-detail) {
     cursor: pointer;
 }

 .footable.breakpoint > tbody > tr > td.footable-cell-detail {
     background: #eee;
     border-top: none;
 }

 .footable.breakpoint > tbody > tr > td > span.footable-toggle {
     display: inline-block;
     font-family: 'footable';
     speak: none;
     font-style: normal;
     font-weight: normal;
     font-variant: normal;
     text-transform: none;
     -webkit-font-smoothing: antialiased;
     padding-right: 5px;
     font-size: 10px;
     color: #444444;
     margin-right: 5px;
 }

 .footable.breakpoint > tbody > tr > td > span.footable-toggle:before {
     content: "\e000";
 }

 .footable.breakpoint.toggle-circle > tbody > tr.footable-detail-show > td > span.footable-toggle:before {
     content: "\e005";
 }

 .footable.breakpoint.toggle-circle > tbody > tr > td > span.footable-toggle:before {
     content: "\e004";
 }

 .footable.breakpoint.toggle-circle-filled > tbody > tr.footable-detail-show > td > span.footable-toggle:before {
     content: "\e003";
 }

 .footable.breakpoint.toggle-circle-filled > tbody > tr > td > span.footable-toggle:before {
     content: "\e002";
 }

 .footable.breakpoint.toggle-square > tbody > tr.footable-detail-show > td > span.footable-toggle:before {
     content: "\e007";
 }

 .footable.breakpoint.toggle-square > tbody > tr > td > span.footable-toggle:before {
     content: "\e006";
 }

 .footable.breakpoint.toggle-square-filled > tbody > tr.footable-detail-show > td > span.footable-toggle:before {
     content: "\e009";
 }

 .footable.breakpoint.toggle-square-filled > tbody > tr > td > span.footable-toggle:before {
     content: "\e008";
 }

 .footable.breakpoint.toggle-arrow > tbody > tr.footable-detail-show > td > span.footable-toggle:before {
     content: "\e00f";
 }

 .footable.breakpoint.toggle-arrow > tbody > tr > td > span.footable-toggle:before {
     content: "\e011";
 }

 .footable.breakpoint.toggle-arrow-small > tbody > tr.footable-detail-show > td > span.footable-toggle:before {
     content: "\e013";
 }

 .footable.breakpoint.toggle-arrow-small > tbody > tr > td > span.footable-toggle:before {
     content: "\e015";
 }

 .footable.breakpoint.toggle-arrow-circle > tbody > tr.footable-detail-show > td > span.footable-toggle:before {
     content: "\e01b";
 }

 .footable.breakpoint.toggle-arrow-circle > tbody > tr > td > span.footable-toggle:before {
     content: "\e01d";
 }

 .footable.breakpoint.toggle-arrow-circle-filled > tbody > tr.footable-detail-show > td > span.footable-toggle:before {
     content: "\e00b";
 }

 .footable.breakpoint.toggle-arrow-circle-filled > tbody > tr > td > span.footable-toggle:before {
     content: "\e00d";
 }

 .footable.breakpoint.toggle-arrow-tiny > tbody > tr.footable-detail-show > td > span.footable-toggle:before {
     content: "\e01f";
 }

 .footable.breakpoint.toggle-arrow-tiny > tbody > tr > td > span.footable-toggle:before {
     content: "\e021";
 }

 .footable.breakpoint.toggle-arrow-alt > tbody > tr.footable-detail-show > td > span.footable-toggle:before {
     content: "\e017";
 }

 .footable.breakpoint.toggle-arrow-alt > tbody > tr > td > span.footable-toggle:before {
     content: "\e019";
 }

 .footable.breakpoint.toggle-medium > tbody > tr > td > span.footable-toggle {
     font-size: 18px;
 }

 .footable.breakpoint.toggle-large > tbody > tr > td > span.footable-toggle {
     font-size: 24px;
 }

 .footable > thead > tr > th {
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     -khtml-user-select: none;
     -moz-user-select: -moz-none;
     -ms-user-select: none;
     user-select: none;
 }

 .footable > thead > tr > th.footable-sortable:hover {
     cursor: pointer;
 }

 .footable > thead > tr > th.footable-sorted > span.footable-sort-indicator:before {
     content: "\e013";
 }

 .footable > thead > tr > th.footable-sorted-desc > span.footable-sort-indicator:before {
     content: "\e012";
 }

 .footable > thead > tr > th > span.footable-sort-indicator {
     display: inline-block;
     font-family: 'footable';
     speak: none;
     font-style: normal;
     font-weight: normal;
     font-variant: normal;
     text-transform: none;
     -webkit-font-smoothing: antialiased;
     padding-left: 5px;
 }

 .footable > thead > tr > th > span.footable-sort-indicator:before {
     content: "\e022";
 }

 .footable > tfoot .pagination {
     margin: 0;
 }

 .footable.no-paging .hide-if-no-paging {
     display: none;
 }

 .footable-row-detail-inner {
     display: table;
 }

 .footable-row-detail-row {
     display: table-row;
     line-height: 2em;
 }

 .footable-row-detail-group {
     display: block;
     line-height: 2em;
     font-size: 1.2em;
     font-weight: bold;
 }

 .footable-row-detail-name {
     display: table-cell;
     font-weight: bold;
     padding-right: 0.5em;
 }

 .footable-row-detail-value {
     display: table-cell;
 }

 .footable-odd {
     background-color: #f7f7f7;
 }

 @font-face {
     font-family: 'footable';
     src: url('../fonts/footable.eot');
     src: url('../fonts/footable.eot?#iefix') format('embedded-opentype'),
         url('../fonts/footable.woff') format('woff'),
         url('../fonts/footable.ttf') format('truetype'),
         url('../fonts/footable.svg#footable') format('svg');
     font-weight: normal;
     font-style: normal;
 }

 .footable tbody tr:nth-child(even) {
     background-color: #fcfcfc;
 }

 .footable tbody tr:nth-child(odd) {
     background-color: #f3f3f3;
 }


 /* Footable Table */


 .mbr-gallery-filter {
     padding-top: 30px;
     padding-bottom: 30px;
     text-align: center;
 }

 .mbr-gallery-filter ul {
     display: inline-block;
     width: 100%;
     padding-left: 0;
     margin-bottom: 0;
     list-style: none;
 }

 .mbr-gallery-filter li {
     display: inline-block;
     padding: 5px 0;
     transition: all .3s ease-out;
 }

 .mbr-gallery-filter li .btn {
     cursor: pointer;
 }

 .btn-primary-outline.mbr:hover,
 .btn-primary-outline.mbr:focus,
 .btn-primary-outline.mbr.focus,
 .btn-primary-outline.mbr.active {
     color: #ffffff !important;
     background-color: #149dcc;
     border-color: #149dcc;
 }

 .btn-primary-outline.mbr,
 .btn-primary-outline.mbr:active {
     background: none;
     border-color: #0b566f;
     color: #0b566f;
 }

 .btn-md.mbr {
     font-weight: 500;
     letter-spacing: 1px;
     margin: .4rem .8rem;
     -webkit-transition: all 0.3s ease-in-out;
     -moz-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
     padding: 1rem 3rem;
     border-radius: 3px;
 }

 .btn.mbr {
     font-weight: 500;
     border-width: 2px;
     font-style: normal;
     letter-spacing: 1px;
     margin: .4rem .8rem;
     white-space: normal;
     -webkit-transition: all 0.3s ease-in-out;
     -moz-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
     padding: 0.5rem 2rem;
     border-radius: 3px;
     display: inline-flex;
     align-items: center;
     justify-content: center;
     word-break: break-word;
     font-size: 15px;
     font-weight: bold;

 }

 .slide-content a {
     /* display:block; */
     /* margin:auto; */
     padding: 1% 2% !important;
     border-radius: 4px;
     color: #000 !important;
     width: 105px;
 }

 .list-unstyled p {
     font-size: 20px;
     font-weight: normal;
     color: #283655;
 }

 .carousel-control.right i {
     margin-left: 4px;
     margin-top: -1px;
 }

 .carousel-control.left i {
     margin-right: 4px;
     margin-top: -1px;
 }

 .carousel-control-next,
 .carousel-control-prev {
     width: 5%;
 }

 .imglist img {
     width: 240px;
     height: 160px;
     border: 2px solid #d3d3d3;
     padding: 5px;
     border-radius: 4px;
     margin-right: 5px;
     margin-bottom: 10px;
 }

 @media only screen and (min-width:0px) and (max-width:992px) {
     .nav-item.dropdown:hover .megamenu {
         opacity: 1;
         visibility: visible;
         transform: rotateX(0deg);
         -o-transform: rotateX(0deg);
         -moz-transform: rotateX(0deg);
         -webkit-transform: rotateX(0deg);
         position: static;
     }

 }

 .nav-item.dropdown:hover .nav-link {
     background-color: #fff;
     color: #16AEE1 !important;
 }



 @media only screen and (min-width:0px) and (max-width:767px) {
     .slide-content {
         top: 10%;
         height: 80%;
     }

     .slide-content .section-title {
         margin-bottom: 0;
         display: none;
     }

     .wibs-section {
         height: 150px;
     }

     .mbr-gallery-filter {
         padding-top: 5px;
         padding-bottom: 15px;
         text-align: center;
     }

     .btn.mbr {
         margin: .4rem 0;
         font-size: 12px;
         margin-right: 5px;
         padding: 0.5rem 1rem;
     }

     .UpdateLoaderImg {
         right: 15%;
     }

 }

 @media only screen and (min-width:768px) and (max-width:991px) {
     .slide-content {
         height: 70%;
     }

     .UpdateLoaderImg {
         margin-top: 0;
         position: absolute;
         right: 30%;
         top: 35%;
     }

 }

 @media only screen and (min-width:0px) and (max-width:991px) {

     .nav-link {
         margin-top: 10px !important;
         padding: 5px 0px;
     }

     .navbar-expand-lg .navbar-nav .nav-link.nav-active {
         padding-left: 5px;
     }

     .megamenu .title {
         border-bottom: 0px solid #CCC;
         font-size: 14px;
         padding: 0px;
         color: #5d5656;
         margin: 0px;
         text-align: left;
         height: 39px;
         font-weight: bold;
         margin-top: 0px;
     }

     .link-list li {
         margin-left: 35px;
     }

 }

 .wow {
     visibility: hidden;
 }

 .video-box {
     background-color: #FFF;
     padding: 10px;
     box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
     border-radius: 7px;
     margin-bottom: 1.5rem;
 }

 video[poster] {
     max-width: 100%;
     height: auto;
     max-height: 185px;
     object-fit: cover;
     width: 100%;
 }

 video {
     max-width: 100%;
 }

 .video-thumbnail {
     position: relative;
     display: block;
     cursor: pointer;
 }

 .video-thumbnail:after {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 97%;
     background-image: url(../images/video-bg.png);
     background-size: 105%;
     border-top-right-radius: 5px;
     border-top-left-radius: 5px;
 }

 .video-box h4 {
     padding-bottom: 0;
     overflow: hidden;
     text-overflow: ellipsis;
     -webkit-line-clamp: 1;
     white-space: nowrap;
 }

 .video-box p {
     color: #000;
     font-weight: 600;
     font-size: small;
 }

 .nav-tabs .nav-link {
     font-weight: 500;
     border-width: 2px;
     border-color: #0b566f;
     font-style: normal;
     letter-spacing: 1px;
     margin: .4rem .8rem !important;
     white-space: normal;
     -webkit-transition: all 0.3s ease-in-out;
     -moz-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
     padding: 0.5rem 2rem;
     border-radius: 3px;
     display: inline-flex;
     align-items: center;
     justify-content: center;
     word-break: break-word;
     font-size: 15px;
     font-weight: bold;
     color: #283655 !important;
     height: auto;
     line-height: normal;
     width: auto;

 }

 .nav-tabs .nav-link.active {
     color: #ffffff !important;
     background-color: #149dcc;
     border-color: #149dcc;
 }

 .nav-tabs .nav-link:hover {
     color: #ffffff !important;
     background-color: #149dcc;
     border-color: #149dcc;
 }

 @media (max-width:480px) {
     .nav-tabs .nav-link {
         display: block;
         text-align: center;
     }

     .video-box h4 {
         white-space: normal;
     }
 }


 .nav-link {
     font-size: 16px;
     font-weight: 500;
     color: #000 !important;
     margin: 15px 15px 5px;
 }

 .nav-link:last-child {
     margin-right: 0;
 }

 .last-nav {
     background: #00AEEF;
     color: #fff !important;
     border-radius: 3px;
     padding: 10px 20px !important;
     text-transform: uppercase;
     font-weight: 400;
 }

 .nav-item .last-nav:hover {
     background: #0075cd;
     color: #fff !important;
 }

 .nav-link:hover {
     color: #00AEEF !important;
 }

 .container {
     max-width: 80%;
 }

 .navbar-toggler span {
     display: block;
     background-color: #000;
     height: 3px;
     width: 25px;
     margin-top: 4px;
     margin-bottom: 4px;
     -webkit-transform: rotate(0deg);
     -moz-transform: rotate(0deg);
     -o-transform: rotate(0deg);
     transform: rotate(0deg);
     position: relative;
     left: 0;
     opacity: 1;
 }

 .navbar-toggler span:nth-child(1),
 .navbar-toggler span:nth-child(3) {
     -webkit-transition: transform .35s ease-in-out;
     -moz-transition: transform .35s ease-in-out;
     -o-transition: transform .35s ease-in-out;
     transition: transform .35s ease-in-out;
 }

 .navbar-toggler:not(.collapsed) span:nth-child(1) {

     left: 0px;
     top: 10px;
     -webkit-transform: rotate(135deg);
     -moz-transform: rotate(135deg);
     -o-transform: rotate(135deg);
     transform: rotate(135deg);
     opacity: 0.9;
 }

 .navbar-toggler:not(.collapsed) span:nth-child(2) {
     height: 12px;
     visibility: hidden;
     background-color: transparent;
 }

 .navbar-toggler:not(.collapsed) span:nth-child(3) {

     left: 0px;
     top: -12px;
     -webkit-transform: rotate(-135deg);
     -moz-transform: rotate(-135deg);
     -o-transform: rotate(-135deg);
     transform: rotate(-135deg);
     opacity: 0.9;
 }

 .navbar-nav {
     padding-right: 0;
 }

 .navbar-nav li a {
     text-transform: uppercase;
 }

 a:hover {
     text-decoration: none;
 }

 input[type="radio"] {
    
 }

 input[type="radio"] + label {
     position: relative;
     display: inline-block;
     padding-right: 1.5em;
     margin-left: 2em;
     cursor: pointer;
     line-height: 1em;
     -webkit-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
 }

 input[type="radio"] + label:before,
 input[type="radio"] + label:after {
     content: '';
     position: fixed;
     top: 0;
     right: 0;
     width: 1em;
     height: 1em;
     text-align: center;
     color: white;
     border-radius: 50%;
     -webkit-transition: all .3s ease;
     transition: all .3s ease;
	 display:none !important;
 }

 input[type="radio"] + label:before {
     -webkit-transition: all .3s ease;
     transition: all .3s ease;
     /*    box-shadow: inset 0 0 0 0.2em #707070, inset 0 0 0 1em white;*/
     border: 1px solid #707070;
     background-color: #fff;
 }

 input[type="radio"]:checked + label:before {
     -webkit-transition: all .3s ease;
     transition: all .3s ease;
     /*    box-shadow: inset 0 0 0 0.2em #707070, inset 0 0 0 1em #C49A6C;*/
     background-color: #FAA91C;
 }

 select {
     background-image: url(../images/down-arrow.png) !important;
     -webkit-appearance: none;
     background-size: 21px;
     background-position: 98% center;
     background-repeat: no-repeat;
 }

 p {
     font-weight: 300;
 }

 .logo {
     /* border-right: 1px solid #c1c1c1; */
     padding-right: 1rem;
     margin-right: 1rem;
 }

 #banner {
     min-height: 700px;
     background-image: url(/images/banner.png);
 }

 #banner {
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
     justify-content: center;
     align-items: center;
     align-content: center;

 }

 #banner .banner-txt h2 {
     color: #fff;
     font-size: 74px;
     position: relative;
     font-weight: 900;
 }

 #banner .banner-txt h2:before {
     position: absolute;
     content: '';
     width: 40px;
     height: 10px;
     top: -10px;
     background-color: #00AEEF;
 }

 #content-sec {
     padding: 3rem 0;
     position: relative;
 }

 #content-sec .header-txt h3 {
     position: relative;
     text-align: center;
     font-size: 35px;
 }

 #content-sec .header-txt h3:before {
     position: absolute;
     content: '';
     width: 40px;
     height: 4px;
     top: -10px;
     left: 45%;
     text-align: center;
     background-color: #00AEEF;
 }

 #content-sec p {
     margin-top: 2rem;

 }

 #services {
     padding: 3rem 0;
     position: relative;
 }

 /*#services:before{
    position: absolute;
     content: url(../images/curve2.svg);
     top: 10px;
     right: 10px;
}
#services:after{
    position: absolute;
   content: url(../images/curve1.svg);
   top: 10px;
     left: 10px;
}*/
 #services h3 {
     color: #231F20;
     letter-spacing: 2px;
     font-size: 35px;
     font-weight: 600;
 }

 #services h4 {
     color: #00AEEF;
     letter-spacing: .5px;
     font-size: 18px;
     font-weight: 400;
     margin-bottom: 1.2rem;
 }

 .curve2,
 .curve1 {
     position: relative;
 }

 .curve2 img {
     position: absolute;
     top: -200px;
     right: 0;
 }

 .curve1 img {
     position: absolute;
     top: 300px;
     left: -140px;
 }

 .txthead {
     font-size: 35px;
     position: relative;
     font-weight: 700;
     margin-top: 2rem;
 }

 .txthead:before {
     position: absolute;
     content: '';
     width: 40px;
     height: 5px;
     top: -10px;
     background-color: #00AEEF;
 }

 #formsec {
     padding: 5rem 6rem;
     box-shadow: 1px 5px 20px rgb(0 0 0 / 8%);
     margin: 2rem auto;
 }

 textarea {
     border-color: #707070 !important;
 }

 .form-control {
     display: block;
     width: 100%;
     height: 50px;
     font-size: 14px;
     color: #262732;
     background-color: transparent;
     background-image: none;
     border: 1px solid #eaeaea;
     border-radius: 4px;
     -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
     -moz-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
     transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
 }

 .form-group {
     margin-bottom: 0rem;
 }

 label {
     margin-bottom: 0;
     font-weight: 700;
     display: contents !important;
     font-size: 12px;
     line-height: 19px;
     margin-bottom: 11px;
 }

 .form-control {
     font-size: 16px;
     z-index: 1;
     position: relative;
     border-width: 2px;
 }

 .form-control,
 .form-control:focus {
     box-shadow: none;
 }

 .form-group {
     position: relative;
 }

 .form-group label,
 .form-group .form-control {
     -webkit-transition-duration: 0.3s;
     -moz-transition-duration: 0.3s;
     transition-duration: 0.3s;
     -webkit-transition-timing-function: ease;
     -moz-transition-timing-function: ease;
     transition-timing-function: ease;
 }

 .form-group label {
     position: relative;
     -webkit-transition-property: -webkit-transform, color;
     -moz-transition-property: -moz-transform, color;
     transition-property: transform, color;
 }

 .form-group .form-control {
     -webkit-transition-property: border-width, background-color;
     -moz-transition-property: border-width, background-color;
     transition-property: border-width, background-color;
 }

 .form-group.-active .form-control,
 .form-group.-focus .form-control {
     border-width: 1px;
     background-color: white;
 }

 .form-group.-animated {
     padding-top: 30px;
 }

 .form-group.-animated label {
     position: absolute;
     left: 10px;
     right: 0;
     top: 0;
     z-index: 0;
     margin-bottom: 0;
     color: #231F20;
     font-weight: 600;
     -webkit-transform: translateY(45.5px);
     -moz-transform: translateY(45.5px);
     -ms-transform: translateY(45.5px);
     -o-transform: translateY(45.5px);
     transform: translateY(45.5px);
 }

 .form-group.-animated.-active label,
 .form-group.-animated.-focus label {
     color: #00AEEF;
     position: absolute;
     left: 5px;
     top: 5px;
     font-weight: 700;
     -webkit-transform: translateY(0);
     -moz-transform: translateY(0);
     -ms-transform: translateY(0);
     -o-transform: translateY(0);
     transform: translateY(0);
 }

 .form-group input:focus {
     border: 1px solid #00AEEF;
 }

 .btn-submit {
     background: #00AEEF;
     width: 100%;
     color: #fff !important;
     margin-top: 30px;
     padding: 10px;
 }

 .btn-submit:hover {
     color: #fff !important;
     background: #0075cd;
 }

 ul.footer-menu li,
 .second-menu li {
     list-style: none;
     text-align: right;
     float: right;
     width: 160px;
 }

 ul.footer-menu .nav-link {
     font-size: 16px;
     font-weight: 500;
     color: #000 !important;
     margin: 15px 0px 5px;
 }

 ul.second-menu .nav-link {
     font-size: 16px;
     font-weight: 500;
     color: #000 !important;
     margin: 0 !important;
     padding: 2px 20px;
 }

 ul.second-menu .nav-link:hover,
 ul.footer-menu .nav-link:hover {
     color: #00AEEF !important;
 }

 #footer .first {
     border-bottom: 1px solid #ccc;
     padding-top: 2rem;
     padding-bottom: 2rem;

 }

 .second {
     padding-top: 2rem;
     padding-bottom: 1rem;
 }

 .second p {
     margin: 0;
     font-size: 14px;
 }



 .intl-tel-input {
     display: table-cell;
 }

 .intl-tel-input .selected-flag {
     z-index: 4;
 }

 .intl-tel-input .country-list {
     z-index: 5;
 }

 .input-group .intl-tel-input .form-control {
     border-top-left-radius: 4px;
     border-top-right-radius: 0;
     border-bottom-left-radius: 4px;
     border-bottom-right-radius: 0;
 }

 ul.footer-menu {
     padding: 0;
     margin: 0;
 }


 @media (max-width: 480px) {
     .navbar {
         padding: 25px 5px !important;
     }

     .container {
         max-width: 100% !important;
     }

     .logo {
         border-right: 0px solid #c1c1c1;
         padding-right: 0rem;
         margin-right: 0rem;
     }

     #footer .first {
         margin: 0 auto;
         text-align: center;
     }

     ul.footer-menu li,
     .second-menu li {
         list-style: none;
         text-align: center;
         float: left;
     }

     ul.footer-menu .nav-link {
         margin: 10px 0px 5px;
         padding: 20px 12px;
     }

     .second {
         text-align: center;
         padding-top: 1rem;
         padding-bottom: 1rem;
     }

     #services {
         padding: 1.5rem 0;
     }

     #banner {
         min-height: 250px;
     }

     #banner .banner-txt h2 {
         font-size: 28px;
         ;
     }

     #banner .banner-txt h2:before {
         top: -10px;
         height: 5px;
     }

     .column-rev {
         -ms-flex-direction: column-reverse !important;
         flex-direction: column-reverse !important;
     }

     .flex-rev {
         -ms-flex-direction: row-reverse !important;
         flex-direction: row-reverse !important;
     }

     #services img {
         margin-bottom: 2rem;
     }

     .py-5 {
         padding-top: 1.5rem !important;
         padding-bottom: 1.5rem !important;
     }

     .curve1 img {
         top: 500px;
     }

     .last-nav {
         width: 160px;
     }

     .nav-link {
         margin: 2px 5px 2px;
         border-bottom: 1px solid #eee;
     }

     .nav-link {
         margin: 2px 5px 2px;
         border-bottom: 1px solid #eee;
     }

     .second-menu .nav-link,
     .footer-menu .nav-link {
         border-bottom: 0px solid #eee;
     }

     #banner {
         background-size: 100% 100%;
     }

     #footer .first {
         padding-top: 0rem;
         padding-bottom: 0rem;
     }

     #formsec {
         padding: 20px;
         margin: .5rem auto 2rem auto;
     }

     /*#footer .container, #footer .col-12{
    padding: 0;
}*/
     #footer .footer-menu,
     .second-menu {
         display: flex;
         flex-direction: row;
         flex-wrap: wrap;
         justify-content: center;
         align-items: center;
         align-content: center;
         margin: 0;
         padding: 0;
     }

     .navbar-nav li:first-child {
         margin-top: 20px;
     }


 }

 @media (max-width: 320px) {
     ul.footer-menu .nav-link {
         padding: 10px 5px;
     }

     a.logo img {
         width: 180px;
     }

 }

 @media (max-width: 1400px) {
     .container {
         max-width: 90%;
     }
 }

 @media (min-width: 1800px) {}


 @media only screen and (min-width: 600px) and (max-width: 1440px) {
     #banner .banner-txt h2 {
         font-size: 60px;
     }

     .container {
         max-width: 90%;
     }

     #banner {
         min-height: 500px;
     }

 }

 @media only screen and (min-width: 200px) and (max-width: 480px) {}

 @media only screen and (min-width: 768px) and (max-width: 1024px) {
     #banner .banner-txt h2 {
         font-size: 38px;
     }

     #banner {
         min-height: 340px;
     }

     img.img-fluid.mx-auto {
         width: 100%;
         height: 65%;
     }

 }

 /******************************
CUSTOM CSS  - END
*******************************/


 @media only screen and (min-width:768px) {
     .navbar-nav {
         flex-direction: row;
         justify-content: space-around;
     }

     .nav-pills .nav-link {
         padding: 10px 14px;
     }


 }

 @media only screen and (min-width: 992px) {}

 @media only screen and (min-width: 1800px) {}


 /*============= navigation styles ================*/

 nav {
     display: block;
     margin: auto;
     background-color: white;
 }

 .navbar {
     padding: 1.2rem;
 }

 nav .fa-chevron-circle-right {
     float: right;
     margin-right: 10px;
     margin-top: 5px;
 }

 nav .fa-chevron-down {
     font-size: 0.7em;
 }


 @media (max-width: 1024px) {


     nav a {
         text-decoration: none;
     }



 }


 @media only screen and (min-width:1025px) {}

 .joi .form-control {
     border: 1px solid #ACACAC !important;
     border-radius: 10px;
     margin-bottom: 1rem;
 }

 .joi .btn-info-dark {
     background-color: #16AEE0;
     color: #fff;
     padding: 6px 25px;
     border-radius: 10px;
     border: 1px solid #16AEE0 !important;
     font-size: 17px !important;
 }

 .joi .btn-info-dark:hover {
     background-color: #2078ba;
     color: #fff;
     border-color: #2078ba !important;
 }

 .job-card {
     padding: 20px;
     border-radius: 10px;
     box-shadow: 0 0 10px rgba(0, 0, 0, 0.22);
     background-color: #fff;
     margin-bottom: 30px;
     display: flex;
     justify-content: space-between;
     align-items: center;
 }

 .job-card h5 {
     color: #283655;
     font-weight: bold;
     margin-bottom: 20px;
     font-size: 20px;
 }

 .job-card p {
     color: #3A3A3A;
 }

 .job-card p img {
     vertical-align: text-top;
     height: 20px;
     width: 20px;
     margin-right: 5px;
 }

 .job-details p b {
     margin-right: 5px;
     font-weight: bold;
 }

 .job-details p:nth-last-child(1) {
     margin-bottom: 0 !important;
 }

 .j-search {
     position: relative;
 }

 .j-search img {
     position: absolute;
     top: 16px;
     left: 10px;
 }

 .j-search input {
     padding-left: 35px;
     background-color: rgba(255, 255, 255, 0) !important;
 }

 .job-apply-btn .btn {
     font-size: 16px !important;
     padding: 10px 50px !important;
     border-radius: 10px;
 }



 @media(max-width:480px) {
     .job-card {
         display: block;
     }

     .job-apply-btn {
         text-align: center;
         margin-top: 18px;
     }
 }


 /* Careers Page styles starts from here */

 .career-sec-1 {
     align-items: center;
 }

 .career-sec-1 h1 {
     color: #000;
     text-transform: uppercase;
     font-size: 2.6vw;
     line-height: 1.3;
 }

 .career-sec-1 h1 span {
     color: #49B8E5;
     margin-top: 12px;
     display: block;
 }

 .career-sec-2 {
     background-color: #F6F6F6;
 }

 .career-sec-2 p {
     text-align: justify;
 }

 .career-sec-2 ul {
     list-style: none;
     padding: 0;
 }

 .career-sec-2 ul li {
     background-color: #fff;
     border-radius: 7px;
     padding: 10px;
     display: inline-block;
     box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
     color: #000000;
     font-weight: bold;
     width: 25%;
     text-align: center;
     margin-right: 5%;
     margin-bottom: 25px;
     font-size:1vw;
 }

 .career-sec-3 {
     background-image: url(../images/career-bg.png);
     background-size: cover;
     margin-top: 50px;
     margin-bottom: 50px;
 }

 .ucv-i {
     position: relative;
 }

 .ucv-i img {
     position: absolute;
     top: 15px;
     right: 10px;
     height: 20px;
     z-index: 9;
 }

 .ucv-i input {
     padding-right: 25px;
 }

 .career-ap-btn {
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin-top: 15px;
 }

 .career-ap-btn img {
     height: 60px;
 }

 .career-sec-2 .row,
 .career-sec-3 .row {
     align-items: center;
 }

 .career-sec-2 h4 {
     font-size: 1.5vw;
 }
 
 .career-sec-3{
	background-color:#fff;
}

 @media(max-width:992px) {
     .career-sec-1 h1 {
         font-size: 30px;
     }

     .career-sec-2 ul li {
         width: 44%;
     }

     .career-sec-2 ul li:nth-last-child(1),
     .career-sec-2 ul li:nth-last-child(2) {
         margin-bottom: 10px;
     }

     .career-sec-3 {
         margin-top: 0;
         margin-bottom: 0;
     }
     
     .career-sec-2 ul li{
		font-size:15px;
	}
	
	.career-sec-2 h4 {
	    font-size: 22px;
	}
 }

 @media(max-width:480px) {
     .career-ap-btn {
         margin-top: 10px;
         margin-bottom: 10px;
     }
 }


.career-sec-3 .form-group {
    margin: 6px 0px;
}
.ucv-i label {
    display: inline-block;
    padding: 5px 13px;
    background-color: #efefef;
    border: solid 1px #767676;
    color: #2c2c2c;
    position: absolute;
    top: 8px;
    left: 10px;
    font-size: 15px;
    z-index: 1;
}

.media-icon img {
     height: 19px;
     margin: 0px 10px;
     vertical-align: middle;
}
 
.media-icon a:hover img {
opacity: 0.9;
}

.career-ap-btn {
   flex-wrap: wrap;
   gap: 15px;
}
 /* Careers Page styles ends from here */
 /*Portal pagination */
 nav:has(.pagination) {
    margin-top: 1rem;
    background-color: transparent !important;
}
 
.page-link {
    border-radius: 4px;
    border-color: transparent;
}
 
.page-item.active .page-link ,
.page-link:hover {
    color: #fff;
    background-color: #16aee1;
    border-color: #16aee1;
}

.rtl {
    direction: rtl;
    text-align: right;
}


